<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
		<script type="text/javascript" src="../../zxt/zxt.js"></script> 
		<script>importZXT("../../zxt");</script>
	</head> 
 
<body> 

	<table style='width:400px'>
		<tr>
			<td><input type="button" value="DisableBtn2" onclick="onClick$DisableBtn2();" /></td>
			<td><input type="button" value="EnableBtn2" onclick="onClick$EnableBtn2();" /></td>
			<td><input type="button" value="DisableAll" onclick="onClick$DisableAll();" /></td>
			<td><input type="button" value="EnableAll" onclick="onClick$EnableAll();" /></td>
			<td><input type="button" value="SwapBtn2" onclick="onClick$SwapBtn2();" /></td>
			<td><input type="button" value="ReorderBtn3" onclick="onClick$ReorderBtn3();" /></td>
		</tr>
	</table>
  
  <hr>

	<div id="text1" zxt="zxt.ui.Textbox" zxt.value="1"></div>
	<div id="text2" zxt="zxt.ui.Textbox" zxt.value="2"></div>
	<div id="text3" zxt="zxt.ui.Textbox" zxt.value="3"></div>
	<div id="text4" zxt="zxt.ui.Textbox" zxt.value="4"></div>
	
	<div id="button1" zxt="zxt.ui.Button" zxt.text="5"></div>
	<div id="button2" zxt="zxt.ui.Button" zxt.text="6"></div>
	<div id="button3" zxt="zxt.ui.Button" zxt.text="7"></div>
	<div id="button4" zxt="zxt.ui.Button" zxt.text="8"></div>
	<div>
		<a href="../index.html">返回</a>
	</div>
</body> 
</html>

<script>
	$zxt.init();	
	
	var oldOrder = null;
	
	var order1 = ["text1", "text2", "text3", "text4"];
	var order2 = ["button1", "button2", "button3", "button4"];
	$zxt.orderComponents(order1);
	
	function onClick$DisableBtn2(){
		$zxtUI.text2.mode("DISABLE");
		$zxtUI.text2.render();
	}
	
	function onClick$EnableBtn2(){
		$zxtUI.text2.mode("Normal");
		$zxtUI.text2.render();		
	}
	
	function onClick$SwapBtn2(){
		$("#text2").empty();
		$zxt.unregister($zxtUI.text2);
		var nt = new zxt.ui.Textbox();
		$zxt.register(nt, "text2");
		$("#text2").append(nt.render());
	}
	
	function onClick$DisableAll(){
		$zxt.mode("DISABLE");
		$zxt.render();
	}
	
	function onClick$EnableAll(){
		$zxt.mode("NORMAL");
		$zxt.render();
	}
	
	function onClick$ReorderBtn3(){
		if ( oldOrder == null ){
			oldOrder = $zxt.focusOrder();
			$zxt.orderComponents(order2);
		} else {
			$zxt.focusOrder(oldOrder);
			oldOrder = null;
		};	
	}
	
	
</script>

